<template>
	<view>
		<!-- #ifdef MP-WEIXIN -->
		<ad unit-id="adunit-2f2458e7ddbddc18" ad-type="video" ad-theme="white"></ad>
		<!-- #endif -->
		<view class="uni-padding-wrap uni-common-mt">
			<view class="uni-title uni-common-mt">
				声音列表
				<text style="color: red;">\n点击左边圆圈按钮试听</text>
			</view>
			<view v-for="item in audio_list" v-if="item.id<audio_list.length-1">
				<view class="uni-flex uni-row">
					<view class="text uni-flex" style="width: 200rpx;height: 220rpx;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;">
						<image src="../../static/play.png" style="width: 150rpx;height: 150rpx;" @click="play_music" :data-item='JSON.stringify(item)'></image>
					</view>
					<view class="uni-flex uni-column" style="-webkit-flex: 1;flex: 1;-webkit-justify-content: space-between;justify-content: space-between;">
						<view class="" style="height: 120rpx;text-align: left;padding-left: 20rpx;padding-top: 10rpx;font-size: 24px;">
							{{item.name}}
						</view>
						<view class="uni-flex uni-row">
							<button type="primary" open-type="share" class="buttonC" :data-id="item.id" style="-webkit-flex: 1;flex: 1;">发送给朋友</button>
							<button type="primary" @click="toTiming" class="buttonC" :data-id="item.id" style="-webkit-flex: 1;flex: 1;">定时</button>
						</view>
					</view>
				</view>
			</view>
			<!-- #ifdef MP-WEIXIN -->
			<view class="uni-flex uni-row" v-show="!showAD">
				<view class="text uni-flex" style="width: 200rpx;height: 220rpx;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;">
					<image src="../../static/play.png" style="width: 150rpx;height: 150rpx;" @click="play_music" :data-item='tbkl'></image>
				</view>
				<view class="uni-flex uni-column" style="-webkit-flex: 1;flex: 1;-webkit-justify-content: space-between;justify-content: space-between;">
					<view class="" style="height: 120rpx;text-align: left;padding-left: 20rpx;padding-top: 10rpx;font-size: 24px;">
						天崩裤裂
					</view>
					<view class="uni-flex uni-row">
						<button type="primary" open-type="share" class="buttonC" :data-id="audio_list.length-1" style="-webkit-flex: 1;flex: 1;">发送给朋友</button>
						<button type="primary" @click="toTiming" class="buttonC" :data-id="audio_list.length-1" style="-webkit-flex: 1;flex: 1;">定时</button>
					</view>
				</view>
			</view>
			<view class="uni-flex uni-row" v-show="showAD">
				<view class="text uni-flex" style="width: 200rpx;height: 220rpx;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;">
					<image src="../../static/egg.png" style="width: 150rpx;height: 150rpx;"></image>
				</view>
				<view class="uni-flex uni-column" style="-webkit-flex: 1;flex: 1;-webkit-justify-content: space-between;justify-content: space-between;">
					<view class="" style="height: 120rpx;text-align: left;padding-left: 20rpx;padding-top: 10rpx;font-size: 24px;color:red">
						超强隐藏音效
					</view>
					<view class="uni-flex uni-row">
						<button type="primary" @click="show" class="buttonC" style="-webkit-flex: 1;flex: 1;">观看视频解锁</button>
						<button type="primary" @click="elemeSave" class="buttonC" style="-webkit-flex: 1;flex: 1;display: none;">扫一扫</button>
					</view>
				</view>
			</view>
			<!-- #endif -->
			<view class="uni-flex uni-row">
				<view class="text uni-flex" style="width: 200rpx;height: 220rpx;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;">
					<image src="../../static/eleme.png" style="width: 150rpx;height: 150rpx;"></image>
				</view>
				<view class="uni-flex uni-column" style="-webkit-flex: 1;flex: 1;-webkit-justify-content: space-between;justify-content: space-between;">
					<view class="" style="height: 120rpx;text-align: left;padding-left: 20rpx;padding-top: 10rpx;font-size: 24px;">
						超大饿了么红包
					</view>
					<view class="uni-flex uni-row">
						<!-- #ifdef MP-WEIXIN -->
						<button type="primary" @click="elemeJump" class="buttonC" style="-webkit-flex: 1;flex: 1;">领取</button> 
						<!-- #endif -->
						<!-- #ifndef MP-WEIXIN -->
						<button type="primary" @click="elemeSave" class="buttonC" style="-webkit-flex: 1;flex: 1;">微信扫一扫</button>
						<!-- #endif -->
					</view>
				</view>
			</view>
			<view class="uni-flex uni-row">
				<view class="text uni-flex" style="width: 200rpx;height: 220rpx;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;">
					<image src="../../static/meituan.png" style="width: 150rpx;height: 150rpx;"></image>
				</view>
				<view class="uni-flex uni-column" style="-webkit-flex: 1;flex: 1;-webkit-justify-content: space-between;justify-content: space-between;">
					<view class="" style="height: 120rpx;text-align: left;padding-left: 20rpx;padding-top: 10rpx;font-size: 24px;">
						超大美团外卖红包
					</view>
					<view class="uni-flex uni-row">
						<!-- #ifdef MP-WEIXIN -->
						<button type="primary" @click="meituanSave" class="buttonC" style="-webkit-flex: 1;flex: 1;">领取</button>
						<!-- #endif -->
						<!-- #ifndef MP-WEIXIN -->
						<button type="primary" @click="meituanSave" class="buttonC" style="-webkit-flex: 1;flex: 1;">微信扫一扫</button>
						<!-- #endif -->
					</view>
				</view>
			</view>
			<view class="uni-title uni-common-mt">
				<p><strong style="font-size: large;">恶搞小技巧</strong></p>
				<p>
					<p><span style="font-weight: bold;">发送给朋友</span>:找个借口让朋友<span style="color: red;">打开手机扬声器</span>，例如先给对方发个很小声的语音或者正在<span style="color: red;">刷短视频</span>的朋友，然后发送给朋友，他一打开就会听到放屁的声音</p>
				</p>
				<br>
				<p>
					<p><span style="font-weight: bold;">定时</span>:定好倒计时，然后<span style="color: red;">放在某个朋友身旁</span>，屏幕朝下，不要息屏，然后立刻离开现场，等时间到，手机会放出放屁的声音，其他朋友会以为是那个朋友放的</p>
				</p>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				play: '../../static/播放.png',
				is_play: false,
				_isLoaded: false,
				_rewardedVideoAd: {},
				audio_list: getApp().globalData.audio_list,
				showAD: true,
				tbkl: '{"id":7,"name":"天崩菊裂","audio_src":"https://downsc.chinaz.net/Files/DownLoad/sound1/201805/10108.mp3"}'
			}
		},
		onReady() {
			// #ifdef MP-WEIXIN
			
			this._isLoaded = false
			var rewardedVideoAd = this._rewardedVideoAd = uni.createRewardedVideoAd({
				adUnitId: 'adunit-9c413474900ea8df',
			}) // 仅用于HBuilder基座调试 adpid: '1507000689'
			rewardedVideoAd.onLoad(() => {
				this._isLoaded = true
				console.log('onLoad event')
				// 当激励视频被关闭时，默认预载下一条数据，加载完成时仍然触发 `onLoad` 事件
			})
			rewardedVideoAd.onError((err) => {
				console.log('onError event', err)
			})
			rewardedVideoAd.onClose((res) => {
				console.log('onClose event', res)
				// 用户点击了【关闭广告】按钮
				if (res && res.isEnded) {
					// 正常播放结束
					// 这里应该联网给予用户激励。且这段代码应该做安全保护，详见下文中的“安全注意”
					this.showAD = false
				} else {
					// 播放中途退出
				}

			})
			// #endif
		},
		onLoad(options) {
			console.log('options')
			console.log(options)
			console.log(this.audio_list)
			// 为了防止苹果手机静音无法播放
			uni.setInnerAudioOption({
				obeyMuteSwitch: false
			})
		},
		onShareAppMessage(res) {
			console.log('分享')
			console.log(res)
			if (res.from === 'button') { // 来自页面内分享按钮
				console.log(res.target)
			}
			if (res.from === 'menu') { // 来自页面内分享按钮
				return {
					title: '送你一份神秘礼物吧！',
					path: '/pages/index/from_share?id=1',
					imageUrl: '../../static/gift.jpg'
				}
			}
			return {
				title: '送你一份神秘礼物吧！',
				path: '/pages/index/from_share?id=' + res.target.dataset.id,
				imageUrl: '../../static/gift.jpg'
			}
		},
		onShareTimeline(res) {
			console.log('分享')
			console.log(res)
			if (res.from === 'button') { // 来自页面内分享按钮
				console.log(res.target)
			}
			return {
				title: '惊喜礼物:送你一份神秘礼物吧！',
				path: '/pages/index/from_share?id=1',
				imageUrl: '../../static/gift.jpg'
			}
		},
		methods: {
			play_music(e) {
				var self = this
				console.log(e)
				let item = JSON.parse(e.currentTarget.dataset.item)
				self.playing(item.audio_src)

			},
			show() {
				if (this._isLoaded) {
					this._rewardedVideoAd.show()
				}
			},
			playing(src) {
				const innerAudioContext = uni.createInnerAudioContext();
				innerAudioContext.autoplay = true;
				innerAudioContext.src = src;
				innerAudioContext.onPlay(() => {
					console.log('开始播放');
				});
				innerAudioContext.onError((res) => {
					console.log(res.errMsg);
					console.log(res.errCode);
				});
			},
			toTiming(e) {
				console.log(e)
				var id = e.currentTarget.dataset.id
				uni.navigateTo({
					url: "/pages/index/timing?id=" + id,
					success(res) {
						console.log(res);
					},
					fail(err) {
						console.log(err);
					}
				});
			},
			elemeJump() {
				uni.navigateToMiniProgram({
					appId: 'wxece3a9a4c82f58c9',
					path: 'taoke/pages/shopping-guide/index?scene=EJ4VHpu',
					extraData: {},
					success(res) {
						// 打开成功
					}
				})
			},
			elemeSave() {
				// 预览图片
				uni.previewImage({
					current: 0,
					urls: ['https://gitee.com/centful/fart-voice/raw/master/static/elemeTG.jpg'],
					success: function(data) {
						console.log(data);
					},
					fail: function(err) {
						console.log(err);
					}
				});
			},
			meituanSave() {
				// 预览图片
				// uni.previewImage({
				// 	current: 0,
				// 	urls: ['https://gitee.com/centful/fart-voice/raw/master/static/mtTuiGuang.jpg'],
				// 	success: function(data) {
				// 		console.log(data);
				// 	},
				// 	fail: function(err) {
				// 		console.log(err);
				// 	}
				// });
				uni.navigateToMiniProgram({
				      appId: 'wxde8ac0a21135c07d',
				      path: 'waimaiunion/pages/union/index?scene=1!6FVWVr5zU-tP!1!2!sVdWvg',
				      extraData: {},
				      success(res) {
				        // 打开成功
				      }
				    })
			}
		}
	}
</script>

<style>
	.text {
		margin: 15rpx 10rpx;
		padding: 0 20rpx;
		background-color: #ebebeb;
		height: 70rpx;
		line-height: 70rpx;
		text-align: center;
		color: #777;
		font-size: 26rpx;
	}

	.buttonC {
		margin: 15rpx 10rpx;
		padding: 0 20rpx;
		height: 70rpx;
		line-height: 70rpx;
		text-align: center;
		font-size: 26rpx;
	}
</style>
